<link rel="stylesheet" href="<%- Virtual_Path.Static %>jquery.plugin/pagination/pagination.css">
<script src="<%- Virtual_Path.Static %>jquery.plugin/pagination/pagination.js"></script>
<!--<script src="<%- Virtual_Path.Static %>jquery.plugin/birthday/birthday.js"></script>-->

<link rel="stylesheet"
      href="<%- Virtual_Path.Static %>jquery.plugin.bootstrap/datetimepicker/css/bootstrap-datetimepicker.min.css"/>
<link rel="stylesheet" href="<%- Virtual_Path.Static %>aceadmin/css/bootstrap.min.css"/>
<script src="<%- Virtual_Path.Static %>jquery.plugin.bootstrap/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="<%- Virtual_Path.Static %>jquery.plugin.bootstrap/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<!-- ace styles class="ace-main-stylesheet id="main-ace-style" -->
<link rel="stylesheet" href="<%- Virtual_Path.Static %>aceadmin/css/ace.min.css"/>
<link rel="stylesheet" href="<%- Virtual_Path.Static %>aceadmin/css/ace.custom.css"/>

<div class="anchor-tab">
    <ul class="tab">
        <li class="on">渠道管理</li>
    </ul>
</div>
<div class="anchor-cont">
    <div class="tabs-cont">
        <div class="hander-func" style="font-size: 14px;">
            <p class="fl">时间查询：
                <input id="dtpList_F_StartDate" type="text" style="width: 85px;height: 24px;" placeholder="开始时间">
                <label>-</label>
                <input id="dtpList_F_EndDate" type="text" style="width: 85px;height: 24px;" placeholder="结束时间">
            </p>
            <p class="fl">
                渠道ID：
                <select name="Channel_ID" id="Channel_ID" style="width: 150px;height: 24px;">
                    <option value="">--</option>
                    <option value="118060101">首页轮播</option>
                    <option value="118060102">首页新闻推荐</option>
                    <option value="118060103">正文页面右侧推荐位</option>
                    <option value="118060104">详情页面飘窗</option>
                </select>
            </p>
            <a href="javascript:;" class="c-button fl" id="J_Channel_Data">查询</a>
            <p class="fl">
                注册总人数：<span id="SignUp_Total" style="color:red;"></span>
                充值总金额(RMB)：<span id="Pay_Total" style="color:red;"></span>
            </p>
        </div>
        <div class="tableinfo">
            <table class="tabinfo">
                <thead>
                <tr>
                    <th>渠道ID</th>
                    <th>注册人数</th>
                    <th>注册并充值人次</th>
                    <th>注册并充值人数</th>
                    <th>注册并充值金币</th>
                    <th>充值总人次</th>
                    <th>充值总人数</th>
                    <th>充值总金币</th>
                </tr>
                </thead>
                <tbody id="J_OrderList">
                <tr>
                    <td colspan="8">加载中...</td>
                </tr>
                </tbody>
            </table>
        </div>
        <div id="AjaxPagination" class="pagination"></div>
    </div>
</div>
<script>
    //////////////////////////////////////////////////////////
    //时间输入框插件
    //////////////////////////////////////////////////////////
    $('#dtpList_F_StartDate , #dtpList_F_EndDate').datetimepicker({
        language: 'zh-CN',
        format: 'yyyy-mm-dd',
        minView: 2,
        autoclose: true
    });
    //////////////////////////////////////////////////////////
    //绑定日期选择框
    //////////////////////////////////////////////////////////
    $.KOC.Date.Select.Bind({
        eSelect: $('#dtpList_F_SelectDate'),
        eBegin: $('#dtpList_F_StartDate'),
        eEnd: $('#dtpList_F_EndDate')
    });
    $(function () {
        var param = {
            Create_Date_Between: '',
            Create_Date_And: '',
            Channel_ID: '',
        };
        if (param.Create_Date_Between == '' && param.Create_Date_And == '' && param.Channel_ID == '') {
            var mydate = new Date();
            $('#dtpList_F_StartDate').val(moment(mydate.toLocaleDateString()).format('YYYY-MM-DD'));
            $('#dtpList_F_EndDate').val(moment(mydate.toLocaleDateString()).format('YYYY-MM-DD'));
            AnchorData();
        }
        //搜索
        $('#J_Channel_Data').on('click', function () {
            param.Create_Date_Between = $.trim($('#dtpList_F_StartDate').val());
            param.Create_Date_And = $.trim($('#dtpList_F_EndDate').val());
            param.Channel_ID = $.trim($('#Channel_ID').val());
            if (param.Create_Date_And && !param.Create_Date_Between) {
                $.KOC.Tips.Open("Error", '请选择开始时间！', {Timeout: 2000});
                return;
            }
            if (!param.Create_Date_And && param.Create_Date_Between) {
                $.KOC.Tips.Open("Error", '请选择结束时间！', {Timeout: 2000});
                return;
            }
            AnchorData();
        });

        function AnchorData() {
            $.ajax({
                url: '/ajax/business.user-chanelsignuppayinfo',
                type: 'post',
                dataType: 'json',
                data: {
                    Create_Date_Between: param.Create_Date_Between,
                    Create_Date_And: param.Create_Date_And,
                    Channel_ID: param.Channel_ID
                },
                success: function (data) {
                    if (data.flag !== 0) {
                        $.KOC.Tips.Open("Error", data.msg + "(" + data.flag + ")", {Timeout: 2000});
                        return;
                    }
                    var _html = '';
                    if (data.data.List.length > 0) {
                        _.forEach(data.data.List, function (ThisValue) {
                            _html += RenderPage(ThisValue, data.data.List.length);
                        });
                    }
                    $('#SignUp_Total').empty().html(data.data.User_ID_Count_Total);
                    $('#Pay_Total').empty().html(data.data.SUM_Money_Total);
                    $('#J_OrderList').empty().html(_html);
                }
            })
        }

        function RenderPage(ThisValue, len) {
            var _html = '';
            if (len <= 0) {
                _html += '<tr>' +
                        '<td colspan="8">没有渠道信息！' +
                        '</td>' +
                        '</tr>';
            } else {
                _html += '<tr>' +
                        '<td>' + ThisValue.Channel_ID +
                        '</td>' +
                        '<td>' + ThisValue.User_ID_Count +
                        '</td>' +
                        '<td>' + ThisValue.SignUp_Pay.User_ID_Count +
                        '</td>' +
                        '<td>' + ThisValue.SignUp_Pay.User_ID_Number +
                        '</td>' +
                        '<td>' + ThisValue.SignUp_Pay.SUM_Coin +
                        '</td>' +
                        '<td>' + ThisValue.Pay.User_ID_Count +
                        '</td>' +
                        '<td>' + ThisValue.Pay.User_ID_Number +
                        '</td>' +
                        '<td>' + ThisValue.Pay.SUM_Coin +
                        '</td>' +
                        '</tr>';
            }
            return _html;
        }
    });
</script>